<!DOCTYPE html>
<html>
<head>
    <title>职位维护</title>
    <link rel="stylesheet" href="<@s.url '/statics/js/layui/css/layui.css'/>"/>
    <link rel="stylesheet" href="<@s.url '/statics/css/common.css'/>"/>
    <script type="text/javascript" src="<@s.url '/statics/js/jquery-3.2.1.js'/>"></script>
    <script type="text/javascript" src="<@s.url '/statics/js/jquery.formautofill.js'/>"></script>
    <script type="text/javascript" src="<@s.url '/statics/js/layui/layui.js'/>" ></script>
    <script type="text/javascript">
        layui.use(['layer','table','form'], function(args){
            layer = layui.layer;
            table = layui.table;
            form = layui.form;
            form.on('submit(position-add-from)', function(data){
                var id = $('#addForm input[name=id]').val();
                if (id && id!=null && id!='')
                    update();
                else
                    add(data.form);
                return false;
            });


        });
        var addWindwodIndex;
        function showAddWindow(type) {
            var title;
            if (type==2){//修改
                var selectedData = table.checkStatus('position-grid').data;
                if (!selectedData|| selectedData.length==0){
                    layer.alert("请选择一条要修改的数据");
                    return;
                }else if (selectedData.length>1){
                    layer.alert("只能选择一条要修改的数据");
                    return;
                }
                title = '修改';
                $('#addForm').autofill(selectedData[0]);
                $('#addForm select').val(selectedData[0].positionId)
            }else{
                title = '新增';
            }
            addWindwodIndex = layer.open({
                type: 1,
                title: title, //不显示标题
                content: $('#addForm'), //捕获的元素，注意：最好该指定的元素要存放在body最外层，否则可能被其它的相对元素所影响
                area:['500px'],
                end:function () {
                    $('#addForm button:reset').click();
                }
            });
        }
        function del(){
            var selectedData = table.checkStatus('position-grid').data;
            if (!selectedData || selectedData.length==0){
                layer.alert("请选择要删除的数据");
                return;
            }
            layer.confirm('确定要删除这些职位?', {icon: 3, title:'提示'}, function(index){
                var ids=[];
                for(var i in selectedData){
                    ids.push(selectedData[i].id);
                }
                $.ajax({
                    url: '<@s.url "/position/deleteByIds.do"/>',
                    data: {ids:ids.join(",")},
                    type:'post',
                    dataType: 'json',
                    success: function (data, textStatus) {
                        layer.alert(data.message,function(index ){
                            if (data.success){
                                table.reload('position-grid');
                            }
                            layer.close(index);
                        })
                    }
                });
                layer.close(index);
            });

        };
        function add(form) {
            $.ajax({
                url: '<@s.url "/position/add.do"/>',
                data: $(form).serialize(),
                dataType: 'json',
                success: function (data, textStatus) {
                    layer.alert(data.message,function(index){
                        if (data.success){
                            layer.close(addWindwodIndex);
                            addWindwodIndex =null;
                            table.reload('position-grid');
                        }
                        layer.close(index);
                    });
                }
            })
        }
        function update(){
            $.ajax({
                url: '<@s.url "/position/update.do"/>',
                data: $("#addForm").serialize(),
                dataType: 'json',
                success: function (data, textStatus) {
                    layer.alert(data.message,function (index) {
                        if (data.success){
                            layer.close(addWindwodIndex);
                            addWindwodIndex =null;
                            table.reload('position-grid');
                        }
                        layer.close(index);
                    });

                }
            });
        }
        function reloadGrid() {
            table.reload('position-grid');
        }
    </script>
</head>
<body>

<div class="layui-btn-group">
    <button class="layui-btn" onclick="showAddWindow(1)" title="添加"><i class="layui-icon">&#xe654;</i>添加</button>
    <button class="layui-btn layui-btn-warm" onclick="showAddWindow(2)" title="修改"><i class="layui-icon">&#xe642;</i>修改</button>
    <button class="layui-btn  layui-btn-danger" onclick="del()" title="删除"><i class="layui-icon">&#xe640;</i>删除</button>
    <button class="layui-btn layui-btn-normal" onclick="javascript:table.reload('position-grid');" title="刷新"><i class="layui-icon">&#x1002;</i>刷新</button>
</div>
<table class="layui-table" lay-data="{height:'full-40',url:'position/list.json',page:true,id:'position-grid',request:{pageName:'pageNum',limitName:'pageSize'},response:{statusName:'status',statusCode:200,countName:'total',dataName:'list'},limit:20}" lay-filter="position-grid">
    <thead>
    <tr>
        <th lay-data="{checkbox:true}"></th>
        <th lay-data="{field:'id',width:200}">ID</th>
        <th lay-data="{field:'positionNo',width:200}">职位代码</th>
        <th lay-data="{field:'positionMc',width:250}">职位名称</th>
    </tr>
    </thead>
</table>

<!--窗口表单-->
<form class="layui-form layui-form-pane window-form" id="addForm" action="add.do" style="display: none">
    <div class="layui-form-item">
        <label class="layui-form-label">ID</label>
        <div class="layui-input-block">
            <input type="text" name="id" class="layui-input" readonly/>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">职位代码</label>
        <div class="layui-input-block">
            <input type="text" name="positionNo" required  lay-verify="required" placeholder="请输入职位代码" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">职位名称</label>
        <div class="layui-input-block">
            <input type="text" name="positionMc" required  lay-verify="required" placeholder="职位名称" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <div class="layui-input-block">
            <button class="layui-btn" lay-submit lay-filter="position-add-from">提交</button>
            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
        </div>
    </div>
</form>
</body>
</html>
